<link rel="stylesheet" herf="__PUBLIC__/admin/kindeditor-4.1.7/themes/default/default.css" />
<link rel="stylesheet" herf="__PUBLIC__/admin/kindeditor-4.1.7/plugins/code/prettify.css" />
<script charset="utf-8" src="__PUBLIC__/admin/kindeditor-4.1.7/kindeditor.js"></script>
<script charset="utf-8" src="__PUBLIC__/admin/kindeditor-4.1.7/lang/zh_CN.js"></script>
<script charset="utf-8" src="__PUBLIC__/admin/kindeditor-4.1.7/plugins/code/prettify.js"></script>
<style>
	.textarea{width:100%;height:300px;visibility:hidden;resize: none; margin: 0 auto;}
	.fixed-table-container{border: none;}
	.th-inner{text-align: center;}
	.table{border :1px solid #eee;}
</style>

<div class="row">
	<ol class="breadcrumb">
		<li><a href="{:U('Index/index')}"><span class="glyphicon glyphicon-home"></span></a></li>
		<li class="active">文章专栏设置</li>
	</ol>
</div><!--/.row-->

<div class="row">
	<div class="col-lg-12">
		<h1 class="page-header">文章专栏设置</h1>
	</div>
</div><!--/.row-->
		

<div class="row">
	<div class="col-lg-12">
		<div class="panel panel-default">
			<div class="panel-body">
				<!-- tab查看数据 -->
				<h3>查看文章：</h3>
				<ul class="nav nav-tabs">
					<li <?php if($activeType==1){echo 'class="active"';} ?> ><a href="#tab1" data-toggle="tab">热门文章</a></li>
					<li <?php if($activeType==2){echo 'class="active"';} ?> ><a href="#tab2" data-toggle="tab">推荐文章</a></li>
					<li <?php if($activeType==3){echo 'class="active"';} ?> ><a href="#tab3" data-toggle="tab">精选文章</a></li>
					<li <?php if($activeType==4){echo 'class="active"';} ?> ><a href="#tab4" data-toggle="tab">UI文章</a></li>
				</ul>

				<div class="tab-content">
					<div class="tab-pane fade <?php if($activeType==1){echo 'in active';} ?> " id="tab1">
						<table data-toggle="table" data-url="tables/data2.json" class="table table-hover">
						    <thead>
							    <tr>
								    <th>
									    <div class="th-inner ">文章标题</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章作者</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章内容</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章日期</div>
								    </th>
								    <th>
									    <div class="th-inner ">图片地址</div>
								    </th>
								    <th>
									    <div class="th-inner ">操作</div>
								    </th>
							    </tr>
						    </thead>
							<tbody>
							<?php foreach($hotarticleData as $k => $v) { ?>
							<tr style="text-align: center; ">
								<td><?php echo $v['articletitle']; ?></td>
								<td><?php echo $v['writer']; ?></td>
								<td><?php echo mb_substr($v['articlecontent'],0,80,"UTF-8"); ?> ...</td> <!-- 截取字符串以免撑破页面 -->
								<td><?php echo $v['articledate']; ?></td>
								<td><?php echo $v['imgurl']; ?></td>
								<td><a href="<?php echo U('Article/articleDel',array('id'=>$v['id'])); ?>">删除</a></td>
							</tr>
							<?php } ?>
							</tbody>
						</table>
					</div>
					<div class="tab-pane fade <?php if($activeType==2){echo 'in active';} ?> " id="tab2">
						<table data-toggle="table" data-url="tables/data2.json" class="table table-hover">
						    <thead>
							    <tr>
								    <th>
									    <div class="th-inner">文章标题</div>
								    </th>
								    <th>
									    <div class="th-inner">文章作者</div>
								    </th>
								    <th>
									    <div class="th-inner">文章内容</div>
								    </th>
								    <th>
									    <div class="th-inner">文章日期</div>
								    </th>
								    <th>
									    <div class="th-inner">图片地址</div>
								    </th>
								    <th>
									    <div class="th-inner">操作</div>
								    </th>
							    </tr>
						    </thead>
							<tbody>
							<?php foreach($recarticleData as $k => $v) { ?>
							<tr style="text-align: center; ">
								<td><?php echo $v['articletitle']; ?></td>
								<td><?php echo $v['writer']; ?></td>
								<td><?php echo mb_substr($v['articlecontent'],0,80,"UTF-8"); ?> ...</td>
								<td><?php echo $v['articledate']; ?></td>
								<td><?php echo $v['imgurl']; ?></td>
								<td><a href="<?php echo U('Article/articleDel',array('id'=>$v['id'])); ?>">删除</a></td>
							</tr>
							<?php } ?>
							</tbody>
						</table>
					</div>
					<div class="tab-pane fade <?php if($activeType==3){echo 'in active';} ?> " id="tab3">
						<table data-toggle="table" data-url="tables/data2.json" class="table table-hover">
						    <thead>
							    <tr>
								    <th>
									    <div class="th-inner ">文章标题</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章作者</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章内容</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章日期</div>
								    </th>
								    <th>
									    <div class="th-inner ">图片地址</div>
								    </th>
								    <th>
									    <div class="th-inner ">操作</div>
								    </th>
							    </tr>
						    </thead>
							<tbody>
							<?php foreach($selarticleData as $k => $v) { ?>
							<tr style="text-align: center; ">
								<td><?php echo $v['articletitle']; ?></td>
								<td><?php echo $v['writer']; ?></td>
								<td><?php echo mb_substr($v['articlecontent'],0,80,"UTF-8"); ?> ...</td>
								<td><?php echo $v['articledate']; ?></td>
								<td><?php echo $v['imgurl']; ?></td>
								<td><a href="<?php echo U('Article/articleDel',array('id'=>$v['id'])); ?>">删除</a></td>
							</tr>
							<?php } ?>
							</tbody>
						</table>
					</div>
					<div class="tab-pane fade <?php if($activeType==4){echo 'in active';} ?> " id="tab4">
						<table data-toggle="table" data-url="tables/data2.json" class="table table-hover">
						    <thead>
							    <tr>
								    <th>
									    <div class="th-inner ">文章标题</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章作者</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章内容</div>
								    </th>
								    <th>
									    <div class="th-inner ">文章日期</div>
								    </th>
								    <th>
									    <div class="th-inner ">图片地址</div>
								    </th>
								    <th>
									    <div class="th-inner ">操作</div>
								    </th>
							    </tr>
						    </thead>
							<tbody>
							<?php foreach($uiarticleData as $k => $v) { ?>
							<tr style="text-align: center; ">
								<td><?php echo $v['articletitle']; ?></td>
								<td><?php echo $v['writer']; ?></td>
								<td><?php echo mb_substr($v['articlecontent'],0,80,"UTF-8"); ?> ...</td>
								<td><?php echo $v['articledate']; ?></td>
								<td><?php echo $v['imgurl']; ?></td>
								<td><a href="<?php echo U('Article/articleDel',array('id'=>$v['id'])); ?>">删除</a></td>
							</tr>
							<?php } ?>
							</tbody>
						</table>
					</div>
				</div>
				<!-- form提交数据 -->
				<h3>添加文章：</h3>
				<form class="text-center" method="post" action="{:U('Article/articleSet')}" enctype="multipart/form-data">
				 	<div class="form-group  text-left">
						<label>文章类型选择</label>
						<select class="form-control" name="type">
							<option value="1" <?php if($activeType==1){echo 'selected="selected"';} ?> >热门文章</option>
							<option value="2" <?php if($activeType==2){echo 'selected="selected"';} ?> >推荐文章</option>
							<option value="3" <?php if($activeType==3){echo 'selected="selected"';} ?> >精选文章</option>
							<option value="4" <?php if($activeType==4){echo 'selected="selected"';} ?> >UI文章</option>
						</select>
					</div>
				 	<div class="form-group text-left">
                        <label>文章标题</label>
                        <input class="form-control" placeholder="请填写文章标题" name="articleTitle">
                    </div>
                    <div class="form-group text-left">
                        <label>文章作者</label>
                        <input class="form-control" placeholder="请填写文章作者" name="writer">
                    </div>
					<div class="form-group text-left">
						<label>文章内容</label>
						<textarea class="textarea" name="articleContent" >文章内容</textarea>
						<br/>
					</div>
					<div class="form-group text-left">
						<label>图片上传</label>
						<input type="file" name="imgurl">
						<p class="help-block">请上传图片,小于2M</p>
					</div>
                    <input type="submit" value="提交内容"  class="btn btn-primary" />
				</form>
			</div>
		</div>
	</div><!-- /.col-->
</div><!-- /.row -->

<script>
	KindEditor.ready(function(K) {
		var editor1 = K.create('textarea[name="articleContent"]', {
			cssPath : '__PUBLIC__/admin/kindeditor-4.1.7/plugins/code/prettify.css',
			allowFileManager : true,
			afterCreate : function() {
				var self = this;
				K.ctrl(document, 13, function() {
					self.sync();
					K('form[name=example]')[0].submit();
				});
				K.ctrl(self.edit.doc, 13, function() {
					self.sync();
					K('form[name=example]')[0].submit();
				});
			}
		});
		prettyPrint();
	});
</script>